import React from "react";
import Title from "../components/Title";
import SDTable from "../dataManage/SDTable";
import api from "../../api";
import { Button, message } from "antd";
//import './index.scss'
export default function XlxxManage() {
  const formRef = React.useRef();
  const actionRef = React.useRef();
  const userId = localStorage.getItem("userId");

  const columns = [
    {
      title: "线路名称",
      dataIndex: "name",
      width: 150,
      ellipsis: true,
    },
    {
      title: "车牌号",
      dataIndex: "licensePlate",
      width: 150,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: "站点",
      dataIndex: "stationName",
      render: (text, record) => {
        return record.stationName.join("、");
      },
      width: 150,
      ellipsis: true,
      hideInSearch: true,
    },

    {
      title: "起始时间",
      dataIndex: "startTime",
      width: 150,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: "结束时间",
      dataIndex: "endTime",
      width: 150,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: "操作",
      dataIndex: "action",
      hideInSearch: true,
      width: 150,
      fixed: "right",
      render: (text, record) => (
         <Button type="primary" 
         onClick={() => handleOrder(record?.routeId)}>预约</Button>
      ),
    },
  ];
  const handleOrder = (routeId) => {
     api.order({routeId,userId}).then((res) => {
        if (res.success) {
           message.success(res.message);
         
        }else {
            message.error(res.message || "预约失败");
        }

     });
  }
  return (
    <div className="css">
      <div style={{ padding: "0 100px" }}>
        <Title title={"线路信息"}></Title>
        <SDTable
          formRef={formRef}
          actionRef={actionRef}
          requestApi={api.xlxx}
          columns={columns}
          // dataSource={[
          //   {
          //     xlmc: "线路1",
          //     xlbh: "浙A12345",
          //     qdz: "杭州",
          //     xllx: "2021-09-01",
          //     xlzt: "2021-09-30",
          //   },
          //   {
          //     xlmc: "线路2",
          //     xlbh: "浙A12345",
          //     qdz: "杭州",
          //     xllx: "2021-09-01",
          //     xlzt: "2021-09-30",
          //   },
          //   {
          //     xlmc: "线路3",
          //     xlbh: "浙A12345",
          //     qdz: "杭州",
          //     xllx: "2021-09-01",
          //     xlzt: "2021-09-30",
          //   },

          // ]}
          options={false}
          //   search={false}
        ></SDTable>
      </div>
    </div>
  );
}
